<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{$Think.config.site.title} - 查看充电宝信息</title>
    <meta name="keywords" content="{$Think.config.site.keywords}">
    <meta name="description" content="{$Think.config.site.description}">
    <link href="{$Think.config.site.resource_url}css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="{$Think.config.site.resource_url}css/plugins/chosen/chosen.css" rel="stylesheet">
    <link href="{$Think.config.site.resource_url}css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
    <link href="{$Think.config.site.resource_url}css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="{$Think.config.site.resource_url}css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="{$Think.config.site.resource_url}css/animate.min.css" rel="stylesheet">
    <link href="{$Think.config.site.resource_url}css/style.min.css?v=4.0.0" rel="stylesheet">
</head>
<body class="gray-bg">
    <div id="show">
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-sm-12">
                    <div class="ibox float-e-margins">
                        <?php if(isset($data)){?>
                        <div class="ibox-content">
                            <div class="alert">
                           
                                <p>{:lang('充电宝ID')}：{$data['batteryid']}</p>
                                <p>{:lang('电量')}：
                                    {if condition="$data['power'] eq 0" }
                                       <font style="color: #ed3745 ">0~20%</font>
                                    {elseif condition="$data['power'] eq 1" /}   
                                        <font style="color: #f9d023 ">20~40%</font>
                                    {elseif condition="$data['power'] eq 2" /}
                                        <font style="color: #d9e021 ">40~60%</font>
                                    {elseif condition="$data['power'] eq 3" /}
                                        <font style="color: #b8db23 ">60~80%</font>
                                    {elseif condition="$data['power'] eq 4" /}
                                        <font style="color: #97dd45 ">80~100%</font>
                                    {else /}
                                    {/if}       
                                </p>
                                <p>{:lang('所在锁ID')}：{$data['key']}</p>
                            </div>
                            <div class="alert">
                                <h3>{:lang('是否要弹出该充电宝')}</h3>
                                <p>&nbsp;</p>
                                <button data-toggle="button" class="btn btn-primary" type="button" id="alertinfo" data-id="{$data['cabinetid']}" data-key="{$data['key']}">{:lang('点击弹出充电宝')}</button>
                            </div>
                        </div>
                        <?php }else{ ?>
                        
                            <div class="ibox-content">
                            <br/><br/><br/>
                                <h3 style="text-align: center;">{:lang('没有找到该设备')}</h3>
                            </div>
                        <?php } ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="{$Think.config.site.resource_url}js/jquery.min.js?v=2.1.4"></script>
    <script src="{$Think.config.site.resource_url}js/bootstrap.min.js?v=3.3.5"></script>
    <script src="{$Think.config.site.resource_url}js/plugins/layer/layer.js"></script>
    <script type="text/javascript">
        $(function(){
             $('#alertinfo').click(function(){
                var cabinet_id =  $(this).data("id");
                var lockid =  $(this).data("key");
                    $.ajax({
                        type : 'POST',
                        url  : '<?php echo \think\Request::instance()->root(); ?>/<?php echo \think\Request::instance()->module(); ?>/Equipment/info',
                        dataType : 'json',
                        data : {cabinet_id:cabinet_id,lockid:lockid},
                        async : false,
                        success : function(result){
                            if(0 == result.code){
                                layer.msg("{:lang('弹出充电宝成功！')}", {icon: 1});
                                parent.location.reload();
                            }else{
                                layer.msg("{:lang('弹出充电宝失败！')}", {icon: 5});
                            }
                        },
                        
                    })
            });  
        });
    </script>
</body>
</html>